<!-- Main content -->
<section class="" ng-init="getSingle()">
    <form id="frm-theme" ng-class="{'submitted': submitted}" 
        ng-submit="save(activedData)" 
        ng-if="activedData">
        <actions preview-url="activedData.detailsUrl" back-url="'/portal/theme/list'"></actions>
        <div class="row justify-content-md-center">
            <div class="col-6">
                <div class="card">
                    <h6 class="card-header">
                        Main Content
                    </h6>
                    <div class="card-body">

                        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
                        <div class="form-group">
                            <input type="text" ng-model="activedData.title" ng-change="generateSEO()"
                                class="form-control form-control-lg"
                                placeholder="Enter your theme name here...">
                        </div>

                        <div class="form-group">
                            <input type="text" ng-model="activedData.previewUrl" class="form-control form-control-lg"
                                placeholder="Preview Url">
                        </div>

                        <div class="form-group">
                            <label>Asset</label>
                            <api-file
                                form-name="'assets'" class="form-control" 
                                posted-file="asset"></api-file>
                        </div>
                        <div class="form-group">
                            <label>Import Theme</label><br />
                            {{theme.name}}
                            <api-file form-name="'theme'" class="form-control" 
                            posted-file="theme"></api-file>
                        </div>
                        <custom-image header="'Image'" type="'Themes'" folder="activedData.name" src-url="activedData.imageUrl"
                            src="activedData.image" auto="'true'"></custom-image>
                        <div class="form-group">
                            <div class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input" ng-model="activedData.isActived" id="isActived">
                                <label class="custom-control-label" for="isActived">Activate this theme to be default
                                    theme</label>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </form>
</section>
<!-- /.content -->
